<template>
  <div id="app">
   <router-view />

<!--    <keep-alive>-->
<!--      <router-view v-if='$route.meta.keepAlive'/>-->
<!--    </keep-alive>-->
<!--    <router-view v-if='!$route.meta.keepAlive'/>-->
  </div>
</template>

<script>

  (function(doc, win){
    var docE1 = doc.documentElement,
      resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
      recalc = function(){
        var clientWidth = docE1.clientWidth;
        if(!clientWidth) return;
        docE1.style.fontSize = (clientWidth / 750)*100  + 'px';
      };
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt,recalc,false);
    doc.addEventListener('DOMContentLoaded',recalc,false);
  })(document,window);

export default {
  name: 'App',
}
</script>

<style>
  @import 'assets/css/base.css';
  @import 'assets/iconfont/iconfont.css';
  @import 'assets/css/monitor.css';
#app {
  max-width: 750px;
  margin: 0 auto;
  height:100vh;
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #f3f3f3;
}
</style>
